---
id: 635060a5c03c950f46174cb5
title: Schritt 1
challengeType: 0
dashedName: step-1
---

# --description--

Statistik ist eine Art, Mathematik zu nutzen, um Daten auszuwerten. Sie hilft uns Muster und Trends in Informationen zu erkennen, so dass wir auf der Grundlage dieser Informationen Vorhersagen und Entscheidungen treffen können.

In dieser Aufgabe wirst du einen Statistikrechner bauen, der aus einer Reihe von Zahlen den Mittelwert, den Median, den Modus, die Standardabweichung und die Varianz zurückgibt.

Das HTML und CSS wurden dir bereits zur Verfügung gestellt. Schaue dir den Code ruhig an - vielleicht fällt dir auf, dass die `calculate`-Funktion aufgerufen wird, wenn das Formular abgeschickt wird. Wenn du bereit bist, dann deklariere eine `calculate`-Variable und weise ihr eine leere Funktion in der `script.js`-Datei zu.

# --hints--

Du solltest das `const`-Schlüsselwort verwenden, um eine Variable `calculate` zu deklarieren.

```js
assert.match(code, /const\s+calculate/);
```

Deine `calculate`-Variable sollte eine Funktion sein.

```js
assert.isFunction(calculate);
```

Deine `calculate`-Funktion sollte leer sein.

```js
assert.match(calculate.toString(), /\{\s*\}/);
```

# --seed--

## --seed-contents--

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="./styles.css" />
    <script src="./script.js"></script>
    <title>Statistics Calculator</title>
  </head>
  <body>
    <h1>Statistics Calculator</h1>
    <p>Enter a list of comma-separated numbers.</p>

    <form onsubmit="calculate();">
      <label for="numbers">Numbers:</label>
      <input type="text" name="numbers" id="numbers" />
      <button type="submit">Calculate</button>
    </form>
    <div class="results">
      <p>
        The <dfn>mean</dfn> of a list of numbers is the average, calculated by
        taking the sum of all numbers and dividing that by the count of numbers.
      </p>
      <p class="bold">Mean: <span id="mean"></span></p>
      <p>
        The <dfn>median</dfn> of a list of numbers is the number that appears in
        the middle of the list, when sorted from least to greatest.
      </p>
      <p class="bold">Median: <span id="median"></span></p>
      <p>
        The <dfn>mode</dfn> of a list of numbers is the number that appears most
        often in the list.
      </p>
      <p class="bold">Mode: <span id="mode"></span></p>
      <p>
        The <dfn>range</dfn> of a list of numbers is the difference between the
        largest and smallest numbers in the list.
      </p>
      <p class="bold">Range: <span id="range"></span></p>
      <p>
        The <dfn>variance</dfn> of a list of numbers measures how far the values
        are from the mean, on average.
      </p>
      <p class="bold">Variance: <span id="variance"></span></p>
      <p>
        The <dfn>standard deviation</dfn> of a list of numbers is the square
        root of the variance.
      </p>
      <p class="bold">
        Standard Deviation: <span id="standardDeviation"></span>
      </p>
    </div>
  </body>
</html>
```

```css
body {
  margin: 0;
  background-color: rgb(27, 27, 50);
  text-align: center;
  color: #fff;
}

button {
  cursor: pointer;
  background-color: rgb(59, 59, 79);
  border: 3px solid white;
  color: white;
}

input {
  background-color: rgb(10, 10, 35);
  color: white;
  border: 1px solid rgb(59, 59, 79);
}

.bold {
  font-weight: bold;
}
```

```js
--fcc-editable-region--

--fcc-editable-region--
```
